import { UploadOutlined } from "@ant-design/icons";
import { Button, Upload, Divider } from "antd";
const props1 = {
    name: "file",
    action: "https://660d2bd96ddfa2943b33731c.mockapi.io/api/upload",
    headers: {
        authorization: "authorization-text",
    },
    onChange(info) {
        console.log(info.status);
    },
};

const props2 = {
    name: "file",
    action: "https://660d2bd96ddfa2943b33731c.mockapi.io/api/upload",
    headers: {
        authorization: "authorization-text",
    },
    onChange(info) {
        console.log(info.status);
    },
    defaultFileList: [
        {
            uid: "1",
            name: "xxx.png",
            status: "uploading",
            url: "http://www.baidu.com/xxx.png",
            percent: 33,
        },
        {
            uid: "2",
            name: "yyy.png",
            status: "done",
            url: "http://www.baidu.com/yyy.png",
        },
        {
            uid: "3",
            name: "zzz.png",
            status: "error",
            response: "Server Error 500",
            // custom error message to show
            url: "http://www.baidu.com/zzz.png",
        },
    ],
};
const View = () => {
    return (
        <>
            <h1>UpLoad上传</h1>
            <Divider>
                <h3>基本使用</h3>
            </Divider>
            <Upload {...props1} style={{ width: "200px" }}>
                <Button icon={<UploadOutlined />}>上传文件</Button>
            </Upload>
            <Divider>
                <h3>上传文件列表</h3>
            </Divider>
            <Upload {...props2} style={{ width: "200px" }}>
                <Button icon={<UploadOutlined />}>上传文件</Button>
            </Upload>
        </>
    );
};

export default View;
